﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Mobile/Masters/MobileSite.master" AutoEventWireup="true" CodeFile="Help.aspx.cs" Inherits="Mobile_Help" %>

<asp:Content ID="Content1" ContentPlaceHolderID="Title" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="Head" Runat="Server">
<style type="text/css">
    .form-container {
        background: none repeat scroll 0 0 #F5F5F5;
        border: 1px solid #003366;
        font-family: verdana,Arial,san-serif;
        font-size: small;
        margin-bottom: 5px;
        margin-left: 6px;
        margin-top: 10px;
        padding-bottom: 20px;
        width: 97%;
    }

    .formrow {
        clear: both;
        padding: 6px 0;
    }
    
    .formrow #alte {
        background: none repeat scroll 0 0 green;
        clear: both;
        padding-top: 8px;
    }
    
    .formrow .label {
        float: left;
        font-size: 90%;
        font-weight: bold;
        padding-bottom: 1px;
        padding-left: 5px;
        text-align: left;
        width: 100%;
    }
    
    .formrow .labeldesc {
        color: #888888;
        font-size: xx-small;
    }
    .formrow .field {
        float: right;
        padding-left: 5px;
        text-align: left;
        width: 100%;
    }
    
    .formheading {
        clear: both;
        padding: 6px 0;
    }
    
    .formheading .label {
        float: left;
        font-weight: bold;
        padding-bottom: 3px;
        padding-left: 5px;
        text-align: left;
    }
    
    .formsubheading {
        clear: both;
        color: #003366;
        font-weight: bold;
        padding-bottom: 10px;
        padding-left: 5px;
        padding-top: 10px;
    }

    #outgoing {
        padding-bottom: 20px;
    }
    
    .singleline-field {
        margin-left: 5px;
    }
    
    .singleline-fieldtitle {
        margin-left: 5px;
    }
    
    .multiselect-field {
        margin-left: 5px;
    }
    
    .stdbutton-field {
        margin-left: 6px;
    }
    
    .textarea-field {
        margin-left: 5px;
        width: 250px;
    }
    
    .textarea-bigfield {
        margin-left: 5px;
    }
    
    #storelisting-small {
        background: none repeat scroll 0 0 #FFFFFF;
        border: 1px solid #BBBBBB;
        overflow-x: hidden;
        padding: 2px;
    }
    
    #storelisting-small ul#booklisting li {
        padding: 5px 1px 5px 5px;
    }
    
    #storelisting-small ul#booklisting li a span {
        vertical-align: top;
    }
    
    #storelisting-small ul#booklisting li a strong {
        font-size: 10px;
    }
    
    input {
        width: 80%;
    }
    
    .mandatory-fld {
        color: orange;
    }
</style>
</asp:Content>

<asp:Content ID="Content3" ContentPlaceHolderID="HeadBody" Runat="Server">
<header>
	<div class="sortable">
		<ul>
			<li><a href="Default.aspx"><strong>E-Document</strong></a></li>
			<li><a href="Login.aspx"><strong>Tài khoản</strong></a></li>
			<li><a href="Default.aspx"><strong>Danh mục</strong></a></li>
		</ul>
		<div class="edge"></div>
		<div class="edge right"></div>
	</div>
</header>
<header>
    <a class="goback" href="javascript: history.go(-1)"><strong>Back</strong></a>
    <h1>Help - Open a new ticket</h1>
</header>
</asp:Content>

<asp:Content ID="Content4" ContentPlaceHolderID="MainContent" Runat="Server">
<div id="bookdesc">
		<div style="padding:8px" id="storelisting-small">
<!-- Helpdeskpilot commercial version 3.0.0 build Nov 26, 2007 -->
<script type="text/javascript">
    var submenu = 'tickets' + '-sub';
    var ele = document.getElementById(submenu);
    if (ele) {
        ele.style.display = 'block';
    }
</script>

<script type="text/javascript">
    function validate_ticket(frm) {
        with (frm) {
            var flag1 = validate_field(client_name, 'Please enter your name');
            if (flag1 == false) {
                return false;
            }

            if (!isEmailAddress(email.value)) {
                alert('Please enter a valid email address');
                email.focus();
                return false;
            }

            var flag3 = validate_field(dept_id, 'Please select a department');
            if (flag3 == false) {
                return false;
            }

            flag = do_this_too(frm);
            if (flag == false) {
                return false;
            }

            var flag1 = validate_field(priority_id, 'Please select a priority');
            if (flag1 == false) {
                return false;
            }

            var flag1 = validate_field(subject, 'Please enter a subject');
            if (flag1 == false) {
                return false;
            }

            var flag1 = validate_field(message, 'Please enter your message');
            if (flag1 == false) {
                return false;
            }

            /*
            for(i=0;i<frm.length;i++)
            {
            if(frm.elements[i].value=="")
            {
            alert("please enter data");
            return false;
            }
            }			
            */

            for (m = 0; m < validate_id.length; m++) {
                var el = document.getElementById(validate_id[m]);
                if (el != null) {
                    if (!validate_field(el, "Please enter a valid value for " + validate_name[m]))
                        return false;

                    if (validate_type[m] == "1" && !IsNumeric(el.value)) {
                        alert("Please enter a valid number for " + validate_name[m]);
                        return false;
                    }
                }
            }

            return true;
        }
    }

    function show_custom_field() {
        frm = document.new_ticket;
        pars = 'dept_id=' + frm.dept_id.value;
        met = 'get';
        var myAjax = new Ajax.Updater('deptcustom', 'get_custom_fields.php', { method: met, parameters: pars, evalScripts: true, onFailure: SuccessHandler, onException: FailureHandler, onSuccess: SuccessHandler });
    }

    function check_for_email_address() {
        frm = document.new_ticket;
        pars = 'email=' + frm.email.value;
        met = 'post';
        var myAjax = new Ajax.Updater('emailexists', 'email_lookup.php', { method: met, parameters: pars, evalScripts: true, onFailure: SuccessHandler, onException: FailureHandler, onSuccess: SuccessHandler });
    }

    function SuccessHandler(req) {
        //alert(req.responseText);
    }

    function FailureHandler(req) {
        //alert(req.responseText);
    }
</script>

    <div style="background: #fff; border:0px; " class="form-container">
<form enctype="multipart/form-data" onsubmit="return validate_ticket(document.new_ticket);" action="new_ticket-iphone-withTop.php" method="post" name="new_ticket" id="new_ticket"> <input type="hidden" value="openticket" name="act">
    <h3 style="padding-left:5px; padding-bottom:15px;">Submit a New Ticket</h3>

    <div class="formrow">	
	    <span class="label">Full Name:</span>
	    <span class="field">
            <input type="text" value="" id="full_name" class="singleline-field" name="client_name"/>
		    <span class="mandatory-fld"> * </span>				
	    </span>	
	</div>

	 <div class="formrow">
		<span class="label">
			Email :
		</span> 
		<span class="field">
			<input type="text" class="singleline-field" value="" name="email"/> <!--onBlur="check_for_email_address();"--> 
			<span class="mandatory-fld">	
						*
			</span>
			<!--<span id="emailexists" class="small-description">
			</span>	-->			
		</span>
    </div>

	<div class="formrow">
		<span class="label">
			Error Message :
		</span> 
		<span class="field">
			<input type="text" class="singleline-field" value="" name="errormsg"/>
			<span class="small-description" id="errormsg">
			</span>				
	    </span>
    </div>

	<div class="formrow">
		<span class="label">
			Handheld Device :
		</span> 
		<span class="field">
			<input type="text" class="singleline-field" value="" name="handheld"/>
			<span class="small-description" id="handheld">
			</span>	
		</span>
	</div>

	<div id="custom_field_data"></div>
    			
	<input type="hidden" value="1" name="dept_id"/>
	<input type="hidden" value="3" name="priority_id"/>
	<input type="hidden" value="9" name="subject"/>
				
	<!--	
	<div class="formrow">
		<span class=label>
			Subject : 
		</span>
		<span class="field">
			<select name="subject" id="subject">
	    	<option value="9" selected> -- Choose a support subject -- </option>
	    	<option value="1">Download Problems</option>
	    	<option value="2">Problems with handheld device</option>
	    	<option value="3">Problems installing Adobe Reader</option>
	    
	    	<option value="4">Problems installing Microsoft Reader</option>
	    	<option value="5">Problems opening eBooks</option>
	    	<option value="6">Problems transferrring to handheld device</option>
	    	<option value="7">Problems Logging in</option>
	    	<option value="8">Problems Purchasing</option>
	    	<option value="10">Order Status</option>
	    
	    	<option value="11">Reply</option>
	    	<option value="12">Problems with Vouchers</option>
	    	<option value="9">Other support issue</option> 
	  	</select>
			<span class="mandatory-fld">	
							*
					</span>				
		</span>
	</div>
-->

    <div class="formrow">
	    <span class="label">
		    Message : 
	    </span>
	    <span class="field">
		    <textarea id="comments" class="textarea-field" rows="10" cols="60" name="message"></textarea>
		    <span class="mandatory-fld">	
						    *
				    </span>				
	    </span>
    </div>

    <div class="formrow">
	    <span class="field">
		    <input type="submit" style="margin:5px" class="button-big" value="Submit" name="Submit"/> 
		    <input type="reset" style="margin:5px" class="button-big" value="Reset" name="reset"/>
	    </span>
	</div>

	<div style="padding-top:50px; padding-left:0px; margin:5px" class="mandatory-txt">
		Fields marked with a <span class="mandatory-fld">*</span> are required.
	</div>	
</form>
    </div>

<script language="javascript" type="text/javascript">
    var group = -1;
    var id = -1;
    var level = -1;
    div_index = 0;
    var div_id = -1;
    current_id = -1;

    var validate_id = new Array();
    var validate_type = new Array();
    var validate_name = new Array();

    function beginsWith(str, search) {
        var ret = (strncmp(str, search, strlen(search)) == 0);
        return ret;
    }

    function endsWith(str, search) {
        var start = str.length - search.length;
        var res = str.substring(start) == search;
        return res;
    };

    var current_element = "";
    function get_child_custom_fields(elem) {
        if (current_id == -1) {
            var found = 0;
            var temp_id = 0;
            while (found == 0) {
                try {
                    var el = document.getElementById(temp_id + "_" + temp_id + "_0");
                    if (el != null)
                        temp_id++;
                    else
                        found = 1;
                }

                catch (e) { found = 1 }

            }
            temp_id--;

            current_id = temp_id;
        }

        current_elem = elem;

        values = (elem.id).split("_");
        id = values[0];
        group = values[1];
        level = values[2];

        var formData = Form.serialize("new_ticket");

        url = "get_child_custom_fields.php" + "?" + "parent_name=" + elem.name + "&parent_value=" +
				elem.value + "&elem_id=" + elem.id;

        new Ajax.Request(
		url,
		{
		    method: "post",
		    parameters: formData, onSuccess: ajax_response
		});

    }

    function validateInt(iString) {
        return (("" + parseInt(iString)) == iString);
    }

    function ajax_response(transport) {
        var response = transport.responseXML;
        var docRoot = response.getElementsByTagName('root');

        var children = response.getElementsByTagName('children');
        var no_of_children = children.length;

        var parent_div = current_elem.parentNode.parentNode;
        var length = parent_div.childNodes.length;
        var kids = parent_div.childNodes;
        var removeNodes = new Array();
        var ctr1 = 0;
        for (p = 0; p < length; p++) {
            try {
                var abc = kids[p].id;
                if (validateInt(abc)) {
                    removeNodes[ctr1++] = kids[p];
                }
            }
            catch (e) { }
        }

        for (p = (removeNodes.length - 1); p >= 0; p--) {
            parent_div.removeChild(removeNodes[p]);
        }

        level++;

        for (i = 0; i < no_of_children; i++) {

            child_div = document.createElement("div");
            child_div.setAttribute("class", "formrow");
            child_div.setAttribute("id", id);

            id++;
            var outer = children[i];
            inner = outer.getElementsByTagName("child");

            span_label = document.createElement("span");
            span_label.setAttribute("class", "label");
            span_label.innerHTML = outer.getAttribute("field_name") + " : ";

            span_field = document.createElement("span");
            span_field.setAttribute("class", "field");

            child_div.appendChild(span_label);
            child_div.appendChild(span_field);

            current_id++;

            var field_type_id = outer.getAttribute("field_type_id");
            var field_display_id = outer.getAttribute("field_display_id");

            if (field_type_id == 3 && field_display_id == 1) {
                elem = document.createElement("select");
                child_div.appendChild(elem);
                elem.setAttribute("id", current_id + "_" + group + "_" + level);
                elem.setAttribute("name", outer.getAttribute("table_field"));

                var typeId = new Array();

                for (j = 0; j < inner.length; j++) {
                    var e = inner[j];
                    option_value = new Option(e.getAttribute("field_answer"), e.getAttribute("answer_id"));
                    elem.options[j] = option_value;
                    typeId[j] = e.getAttribute("field_type_id");


                    elem.onchange = function () {
                        if (typeId[j] != 0)
                            get_child_custom_fields(this);
                    }

                }

                var compulsory = inner[0].getAttribute("compulsory");

                if (compulsory == "1") {
                    span_mandatory = document.createElement("span");
                    span_mandatory.setAttribute("class", "mandatory-fld");
                    child_div.appendChild(span_mandatory);
                    span_mandatory.innerHTML = "*";
                }

                span_field.appendChild(elem);
                parent_div.appendChild(child_div);
            }

            if (field_type_id == 3 && field_display_id == 2) {
                var typeId = new Array();

                for (j = 0; j < inner.length; j++) {
                    var elem = document.createElement("input");
                    elem.setAttribute("type", "radio");
                    var e = inner[j];
                    elem.setAttribute("value", e.getAttribute("answer_id"));
                    elem.setAttribute("id", current_id + "_" + group + "_" + level);
                    elem.setAttribute("name", outer.getAttribute("table_field"));
                    typeId[j] = e.getAttribute("field_type_id");

                    elem.onchange = function () {
                        if (typeId[j] != 0)
                            get_child_custom_fields(this);
                    }

                    var objTextNode = document.createTextNode(e.getAttribute("field_answer"));
                    var objLabel = document.createElement("label");
                    objLabel.appendChild(elem);
                    objLabel.appendChild(objTextNode);

                    span_field.appendChild(objLabel);

                }
                var compulsory = inner[0].getAttribute("compulsory");

                if (compulsory == "1") {
                    span_mandatory = document.createElement("span");
                    span_mandatory.setAttribute("class", "mandatory-fld");
                    child_div.appendChild(span_mandatory);
                    span_mandatory.innerHTML = "*";
                }
                parent_div.appendChild(child_div);
            }


            if (field_type_id == 2) {
                var elem = document.createElement("input");
                elem.setAttribute("type", "text");
                elem.setAttribute("id", current_id + "_" + group + "_" + level);
                elem.setAttribute("name", outer.getAttribute("table_field"));
                span_field.appendChild(elem);
                parent_div.appendChild(child_div);

                var compulsory = inner[inner.length - 1].getAttribute("compulsory");
                if (compulsory == "1") {
                    var tot = validate_id.length;
                    validate_id[tot] = current_id + "_" + group + "_" + level;
                    validate_name[tot] = outer.getAttribute("field_name");
                    validate_type[tot] = field_type_id;
                }

            }

            if (field_type_id == 1) {
                var elem = document.createElement("input");
                elem.setAttribute("type", "text");
                elem.setAttribute("id", current_id + "_" + group + "_" + level);
                elem.setAttribute("name", outer.getAttribute("table_field"));
                span_field.appendChild(elem);
                parent_div.appendChild(child_div);

                var compulsory = inner[inner.length - 1].getAttribute("compulsory");
                if (compulsory == "1") {
                    var tot = validate_id.length;
                    validate_id[tot] = current_id + "_" + group + "_" + level;
                    validate_name[tot] = outer.getAttribute("field_name");
                    validate_type[tot] = field_type_id;
                }


            }

            if (field_type_id == 1 || field_type_id == 2) {
                var compulsory = inner[0].getAttribute("compulsory");

                if (compulsory == "1") {
                    span_mandatory = document.createElement("span");
                    span_mandatory.setAttribute("class", "mandatory-fld");
                    child_div.appendChild(span_mandatory);
                    span_mandatory.innerHTML = "*";
                }
                parent_div.appendChild(child_div);

            }


            if (navigator.appName != "Microsoft Internet Explorer")
                continue;

            for (m = 0; m < child_div.attributes.length; m++) {
                if (child_div.attributes[m].name == "CLASS" || child_div.attributes[m].name == "class") {
                    child_div.attributes[m].value = "formrow";
                }
            }
            for (m = 0; m < span_label.attributes.length; m++) {
                if (span_label.attributes[m].name == "CLASS" || span_label.attributes[m].name == "class") {
                    span_label.attributes[m].value = "label";
                }
            }
            for (m = 0; m < span_field.attributes.length; m++) {
                if (span_field.attributes[m].name == "CLASS" || span_field.attributes[m].name == "class") {
                    span_field.attributes[m].value = "field";
                }
            }




        }

    }







</script>
        </div>
</div>
</asp:Content>

